<!doctype html>
<html>

<head>
	<meta charset="utf-8">
	<title>无标题文档</title>
	<link href="/static/css/default.css" rel="stylesheet" type="text/css">
	<link href="/static/css/style/green.css" rel="stylesheet" type="text/css" id='link'>
	<link rel="stylesheet" href="/static/FileUpload/css/jquery.fileupload.css" />
</head>

<body style="overflow:hidden; padding:10px;">
	<form>
		<div id="app">
			<table class="formtable" style="width:580px;">

				<tbody>
					<tr>
						<td>班级名称</td>
						
						<td>操作</td>
					</tr>
					<tr v-for="uitem in arrayData">
						<td>{{uitem.classname}}</td>
					
					
						<td>
					
								<a v-on:click="vdel(uitem)">删除</a>
						</td>
					</tr>

				</tbody>
			</table>
			<table class="formtable" style="width:580px;">

				<tbody>

					<tr>
						<td class="tlabel">班级</td>
						<td>
								<select type="text" id="classid"  class="select">
										<option value="">
											请选择
										   </option>
										   <option v-for="item in list" :value='item.id'>
											{{item.classname}}
										   </option>
									   </select>
						</td>
					</tr>

				



				</tbody>

			</table>

			<div class="formbtn">
				<input type="button" value="保存" class="btnsave">
				<input type="button" value="取消" class="btncancel">
			</div>
			<input type="hidden" id="id" value="{$id}" />
			
		</div>
	</form>


</body>
<script type="text/javascript" src="/static/js/jquery.js"></script>
<script type="text/javascript" src="/static/js/common.js"></script>
<script type="text/javascript" src="/static/js/vue2.js"></script>
<script src="/static/js/layer/layer.js"></script>
<script src="/static/FileUpload/js/vendor/jquery.ui.widget.js"></script>
<script src="/static/FileUpload/js/jquery.iframe-transport.js"></script>
<script src="/static/FileUpload/js/jquery.fileupload.js"></script>
<script>
	
	var app = new Vue({
		el: '#app',
		data: {
			list: [],
			arrayData:[]
		},
		methods: {
			getdata: function () {
				var _self = this;//保存this的指向
                $.get('/Index/Myclass/GetMyClassList', function (data) {
                    _self.list = data;
                });
				var id =$("#id").val();
				$.post("/Index/Teacher/myclasslist",{id:id},function(data){
					_self.arrayData= data;
				})
			},
			vdel:function(uitem){
				var self = this;
				parent.layer.confirm('确定要删除吗?', {
					btn: ['是', '否'] //按钮
				}, function () {
					parent.layer.closeAll('dialog');
					$.post("/Index/Teacher/guanliandel", { "id": uitem.id }, function (data) {
						if (data.status == 200) {
							layer.msg(data.message);
							self.getdata("");
						} else {
							layer.msg(data.message);
						}
					});
				}, function () {

				});
			}

		},
		created: function () {  //初始化事件里边去调用查询方法
			this.getdata();
		}
	});

	$(function () {

		$(".btnsave").click(function () {
		
			var classid = $("#classid").val();
		
			if(classid==""){
				layer.msg("请选择班级");
				return;
			}
			
			
			var id = $("#id").val();
			
			$.post("/Index/Teacher/teacherandclassadd", {
				"id": id, "classid": classid
			}, function (data) {
				if (data.status == 200) {
					layer.msg(data.message);
					app.getdata();
				} else {
					layer.msg(data.message);
				}
			});
		});
		$(".btncancel").click(function () {
			var index = parent.layer.getFrameIndex(window.name);
			parent.layer.close(index);
		});
	});


</script>

</html>